{% extends "base.html" %}

{% block title %}作业管理 - 学生作业提交系统{% endblock %}

{% block content %}
<div class="row">
    <div class="col-12">
        <div class="card shadow">
            <div class="card-header bg-primary text-white">
                <h4 class="mb-0">
                    <i class="bi bi-file-earmark-text me-2"></i>
                    作业管理
                </h4>
            </div>
            <div class="card-body">

                <div class="row">
                    {% for experiment in experiments %}
                    <div class="col-md-4 mb-4">
                        <div class="card h-100 {% if assignment_status[experiment] %}border-success{% else %}border-secondary{% endif %}">
                            <div class="card-header {% if assignment_status[experiment] %}bg-success text-white{% else %}bg-secondary text-white{% endif %}">
                                <h5 class="mb-0">
                                    <i class="bi bi-{% if assignment_status[experiment] %}check-circle-fill{% else %}circle{% endif %} me-2"></i>
                                    {{ experiment }}
                                </h5>
                            </div>
                            <div class="card-body d-flex flex-column">
                                <div class="mb-3">
                                    {% if assignment_status[experiment] %}
                                    <span class="badge bg-success">
                                        <i class="bi bi-check-lg me-1"></i>
                                        已提交
                                    </span>
                                    {% else %}
                                    <span class="badge bg-warning">
                                        <i class="bi bi-exclamation-triangle me-1"></i>
                                        未提交
                                    </span>
                                    {% endif %}
                                </div>
                                
                                <div class="mt-auto">
                                    <div class="mb-2">
                                        <input type="file" class="form-control form-control-sm" 
                                               id="file-{{ experiment }}" accept=".pdf">
                                    </div>
                                    <div class="btn-group w-100 mb-2" role="group">
                                        <button type="button" class="btn btn-primary btn-sm" 
                                                onclick="uploadFile('{{ experiment }}')">
                                            <i class="bi bi-upload me-1"></i>
                                            上传
                                        </button>
                                        {% if assignment_status[experiment] %}
                                        <button type="button" class="btn btn-danger btn-sm" 
                                                onclick="deleteFile('{{ experiment }}')">
                                            <i class="bi bi-trash me-1"></i>
                                            删除
                                        </button>
                                        {% endif %}
                                    </div>
                                    
                                    {% if assignment_status[experiment] %}
                                    <button type="button" class="btn btn-info btn-sm w-100" 
                                            onclick="previewFile('{{ experiment }}')">
                                        <i class="bi bi-eye me-1"></i>
                                        预览
                                    </button>
                                    {% endif %}
                                </div>
                            </div>
                        </div>
                    </div>
                    {% endfor %}
                </div>


            </div>
        </div>
    </div>
</div>

<!-- 成功/错误消息模态框 -->
<div class="modal fade" id="messageModal" tabindex="-1">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title" id="messageModalTitle">提示</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body" id="messageModalBody">
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">确定</button>
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block scripts %}
<script>
function showMessage(title, message, isSuccess = true) {
    document.getElementById('messageModalTitle').textContent = title;
    document.getElementById('messageModalBody').innerHTML = message;
    const modal = new bootstrap.Modal(document.getElementById('messageModal'));
    modal.show();
    
    if (isSuccess) {
        setTimeout(() => {
            location.reload();
        }, 1500);
    }
}

function uploadFile(experiment) {
    const fileInput = document.getElementById(`file-${experiment}`);
    const file = fileInput.files[0];
    
    if (!file) {
        showMessage('错误', '请选择要上传的文件', false);
        return;
    }
    
    if (file.type !== 'application/pdf') {
        showMessage('错误', '只能上传PDF格式的文件', false);
        return;
    }
    
    const formData = new FormData();
    formData.append('file', file);
    
    fetch(`/upload/${experiment}`, {
        method: 'POST',
        body: formData
    })
    .then(response => response.json())
    .then(data => {
        if (data.success) {
            showMessage('成功', data.message, true);
        } else {
            showMessage('错误', data.message, false);
        }
    })
    .catch(error => {
        showMessage('错误', '上传失败，请重试', false);
    });
}

function deleteFile(experiment) {
    if (!confirm(`确定要删除${experiment}的作业吗？`)) {
        return;
    }
    
    fetch(`/delete/${experiment}`, {
        method: 'POST'
    })
    .then(response => response.json())
    .then(data => {
        if (data.success) {
            showMessage('成功', data.message, true);
        } else {
            showMessage('错误', data.message, false);
        }
    })
    .catch(error => {
        showMessage('错误', '删除失败，请重试', false);
    });
}

function previewFile(experiment) {
    window.open(`/preview/${experiment}`, '_blank');
}


</script>
{% endblock %} 